Help with CSS Menu

I can't get the my CSS menu to display properly. Not sure what's going
on, but I'm probably not designing the nested list styles correctly.
Any help is much appreciated.

Thanks.

Html:

Brandon wrote:
> On Jun 5, 10:53 am, "Jukka K. Korpela" wrote:
>> Scripsit Brandon:
>>
>>> I can't get the my CSS menu to display properly.

Here, you probably really mean "to display the way I want it," as
opposed to "to display properly." In FF, at least, I think it's being
displayed properly. In IE <7, :hover is not supported for elements
besides , so although I didn't look at your page in IE, I don't
expect it to work there either.

>> Post a URL, not snippets.

Brandon, here's where you should have inserted the URL (rather than down
below). I know Google Groups doesn't make it simple for you. But you can
quote the previous poster's message, inject your responses at the
relevant points, and delete the parts which aren't directly relevant to
your reply.

>>
>> --
>> Jukka K. Korpela ("Yucca")http://www.cs.tut.fi/~jkorpela/

You don't need to quote other posters' signatures. In future posts, feel
free to manually trim the sig separator and what follows.

> http://www.imfx.com/test/
>
> I only want sub-menus list indices to display when it's parent list
> index is hovered over. It's not doing that. You can see that two list
> trees are overlapping if you hover over 2007 because it's displaying
> the entire tree hierarchy below 2007, not just 05.
>
> Any ideas how to fix this?

Yes. When you use rules like

#nav ul li:hover ul,
#nav u1 ul li:hover ul,
#nav ul ul ul li:hover ul
{ display: block; }

you are specifying the display (as block) of *all* the ul elements which
are descendants of #nav ul li:hover (or #nav u1 ul li:hover or #nav ul
ul ul li:hover). So you've told the browser to display all the

s
which are under the hovered list item.

What I'm guessing you want is to have the menus expand only when the
immediate parent is being hovered. For that, you need to specify more
rules, more fully. Child selectors might help, but child selectors are
not supported by IE 5, 5.5 and 6. Don't know about IE7.

Looks tedious, doesn't it? And this is just your little test page; I
imagine you foresee pages in the future with more content (i.e., more
cascading menus with fuller lists). FWIW, you might be happy with some
of the pre-done menus at Listamatic
(http://css.maxdesign.com.au/listamatic/). You'll have to work out the
nesting yourself, though.

Even more tedious is the user's experience, because it can be really
difficult the manipulate the mouse so as to successfully negotiate the
weavy path of your menu. One false twitch and the whole menu can
disappear out from under your visitor.

HTH
--
John